<!DOCTYPE html>
<html>
    <!-- 请在服务器端运行该程序以获得正确路径 -->

    <head>
        <meta charset="utf-8">
        <title>i18n Demo</title>
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <link rel="stylesheet" href="">
    </head>

    <body>
        <!-- 显示的主体内容 -->
        <div i18n="footer.about">About</div>
        <div i18n="footer.contact">Contact us</div>
        <!-- 切换按钮 -->
        <button type="button" class="chinese">切换为中文</button>
        <button type="button" class="english">switch to english</button>
    </body>

    <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
    <script src="../jquery.i18n.min.js"></script>
    <script>
        $(document).ready(function() {
            /*默认语言*/
            var defaultLang = "en";
            $("[i18n]").i18n({
                defaultLang: defaultLang,
                filePath: "./i18n/",
                filePrefix: "i18n_",
                fileSuffix: "",
                forever: true,
                get:true,
                callback: function() {
                    console.log("i18n is ready.");
                }
            });
            console.log("window.I18n ===============")
            console.log(I18n.get("footer.about"))
            console.log("===============")
            
            
            /*切换为中文 - 按钮*/
            $(".chinese").click(function() {
                var i18n = $("[i18n]").i18n({
                    defaultLang: "cn",
                    filePath: "./i18n/",
                    get:true
                });
                console.log(i18n.get("footer.about"));
                console.log("这是window.I18n = "+I18n.get("footer.about"))
            });
            /*切换为英文 - 按钮*/
            $(".english").click(function() {
                var lang = $("[i18n]").i18n({
                    defaultLang: "en",
                    filePath: "./i18n/",
                    get:true
                });
                console.log(lang.get("footer.about"));
                console.log("这是window.I18n = "+I18n.get("footer.about"))
                
            });
            
        });
    </script>

</html>
